<template>
	<view>
		<view class="uni-padding-wrap">
			<form @submit="formSubmit" >
				
				<view class="cu-form-group">
					<view class="title">旧密码</view>
					<input placeholder="请输入旧密码" name="pwd" type="password" ></input>
				</view>
				<view class="cu-form-group">
					<view class="title">新密码</view>
					<input placeholder="请输入新密码(6至20数字或字母)" name="newpwd" type="password" :value="PWD" @input="inputPWD"></input>
				</view>
				<view class="cu-form-group">
					<view class="title">确认密码</view>
					<input placeholder="请再次输入新密码" name="newpwd1" type="password"></input>
				</view>
				
				
				<view class="uni-btn-v uni-common-mt">
						<button class="btn-submit" formType="submit" type="primary">确定</button>
				</view>
			</form>
		</view>
	</view>
</template>

<script>
	//来自 graceUI 的表单验证， 使用说明见手册 http://grace.hcoder.net/doc/info/73-3.html
	var  graceChecker = require("../../../common/graceChecker.js");
	export default {
		data() {
			return {
				PWD:''
			}
		},
		onLoad() {
			
			uni.startPullDownRefresh();
		},
		onPullDownRefresh() {
			console.log('refresh');
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		methods: {
			sleep1(numberMillis) { 
				var now = new Date(); 
				var exitTime = now.getTime() + numberMillis; 
				console.log("6666666666666")
				while (true) { 
					now = new Date(); 
					if (now.getTime() > exitTime) {
						return; 
					}
				} 
			},
			formSubmit: function (e) {
				console.log(this.PWD);
				//将下列代码加入到对应的检查位置
				//定义表单规则
				var rule = [
					{name:"pwd", checkType : "notnull", checkRule:"",  errorMsg:"请输入旧密码"},
					{name:"newpwd", checkType : "reg", checkRule:"^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,16}$",  errorMsg:"密码过于简单"},
					{name:"newpwd1", checkType : "same", checkRule:this.PWD,  errorMsg:"两次新输入不一致"}
				];
				//进行表单检查
				var formData = e.detail.value;
				var checkRes = graceChecker.check(formData, rule);
				if(checkRes){
						// uni.showToast({title:"验证通过!", icon:"none"});
					this.$http.post('/user/updatePWD',{
						SIGNATURE : uni.getStorageSync("SIGNATURE"),
						TOKEN: uni.getStorageSync("userInfo").TOKEN,
						PWD:e.detail.value.pwd,
						NEWPWD:e.detail.value.newpwd,
						// PAYTOKEN:uni.getStorageSync("userInfo").TOKENP,
					}).then((res)=>{
						if(res.data.STATE == '903'||res.data.STATE == '904'||res.data.STATE == '905'||res.data.STATE == '906'||res.data.STATE == '907'){
							uni.navigateTo({
								url:'/pages/public/login1'
							})
						}else if(res.data.STATE === "0" && res.statusCode === 200){
							this.sleep1(1000);
							this.$http.post('/user/loginPay',{
								SIGNATURE : uni.getStorageSync("SIGNATURE"),
								TOKEN: uni.getStorageSync("userInfo").TOKEN,
								PWD:e.detail.value.newpwd,
							}).then((res1)=>{
								//判断返回内容
								if(res1.data.STATE === "0" && res1.statusCode === 200){
									// let userInfo = uni.getStorageSync("userInfo")
									// userInfo.TOKENP = res1.data.OBJECT
									// uni.setStorageSync("userInfo",userInfo)
									uni.showModal({
										title:'修改成功',
										success:function(e){
											uni.navigateTo({
												url:'/pages/money/money'
											})
										}
									})
									
								}
							})
							.catch((err1)=>{
							    console.log('request fail', err1);
							})
						}else{
							uni.showToast({
								title:res.data.MSG,
								icon:"none"
							})
						}
					})
					.catch((err)=>{
					    console.log('request fail', err);
					})
						
						
						
						
						
				}else{
					uni.showToast({ title: graceChecker.error, icon: "none" });
				}
			},
			inputPWD(e) {
				this.PWD = e.target.value
			}
		}
	}
</script>

<style lang="scss">
	page {
			background: #f5f5f5;
	}
	.btn-submit{
		background-color: #E02E24;
		margin: 50upx 60upx;
	}
	
	.cu-form-group {
		background-color: #ffffff;
		padding: 1upx 50upx;
		display: flex;
		align-items: center;
		min-height: 100upx;
		justify-content: space-between;
	}
	.cu-form-group+.cu-form-group {
		border-top: 1upx solid #eee;
	}
	.cu-form-group .title {
		text-align: justify;
		font-size: 28upx;
		position: relative;
		height: 60upx;
		line-height: 60upx;
		min-width: calc(4em + 15px);
	}
	input{
		font-size: 28upx;
		
		color: #999999;
		width: 500upx;
	}
</style>
